<template>
	<div>
		<div class="header"> 
			<img src="../../../static/images/location.png" class="location">
			<span>当前位置：{{location}}</span>
		</div>
		<swiper indicator-dots="true"  
			autoplay="true" 
			class='banner'  
			circular ='true' 
			interval="3000" 
			indicator-color="rgba(228,228,228,1)" 
			indicator-active-color="#FECA49">
	        <div v-for="(item,idx) in bannerList" :key="idx">
	            <swiper-item>
	                <img style='width:100%' :src="item" class="bannerimg"></img>
	            </swiper-item>
	        </div>
    	</swiper>
    	<OrderList v-if="!noBind"  :dataList='dataList' :more='more' :LoadIng='LoadIng'></OrderList>
		
    	<noBind v-if="noBind"></noBind>
	</div>

</template>
<script type="text/javascript">
	import {get} from '../../utils/index'
	import OrderList from '@/components/orderList'
	import noBind from '@/components/nobind'
	export default{
		
		
		
		mounted(){

			this.getLocation();
			this.getBanner();
			
		},	
		components:{
			OrderList,
			noBind
		},
		data(){
			return{
				location:'',
				bannerList:[],
				noBind:false,
				dataList:[],
				page:0,
				isDaili:0,//是否代理
				more:true, //还有更多数据
				LoadIng:true
			}
		},
		onShow(){
			this.userInfo = wx.getStorageSync('userDo')
			if(!this.userInfo){
				this.getUserInfo();
			}else{
				this.noBind = false
				wx.showTabBar({
					animation: true
				})
				if(!this.dataList.length){
					this.getDataList(true);
				}
			}		
		},
		methods:{
			getLocation(){
				var vm = this;
		        wx.getLocation({
		          type: 'gcj02',
		          success: function (res) {
		              let latitude = res.latitude;
		              let longitude = res.longitude;      
		              wx.request({
		                  url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude + '&key=HN3BZ-DRA6J-EZ7FW-K2OXV-ADMMF-G2BH7',
		                  method: "get",
		                  success: function (res) {
		                    var l = res.data.result.address_reference.crossroad.title
		                    vm.location = l
		                  }
		              })
		          },
		        })            
			},
			async getUserInfo(){
				this.userInfo = wx.getStorageSync('userDo')
				if(!this.userInfo){
					const code = await this.wxLoin();
					
					const openid = await get('getOpenId',{code:code});
					wx.setStorageSync('kyboppenid', openid)
					const res = await get('getUsersMsg',{appOpenid:openid})
					this.LoadIng = false
					if(res.code == 500){
						this.noBind = true
						wx.hideTabBar({
							animation: true
            })
					}else{
						this.userInfo = res.userDO
						wx.setStorageSync('userDo', res.userDO)
					}
				}
			},
			wxLoin(){
				return new Promise((resolve,reject) => {
					wx.login({
						success:res=>{
							resolve(res.code)
						},
						fail:err =>{
							reject(err)
						}
					})
				})
			},
			
			async getDataList(init){
				var user = wx.getStorageSync('userDo')
				var vm = this;
				if (init) {
						this.page = 0
						this.more = true
			   }
				if(user){
					wx.showNavigationBarLoading()
					this.LoadIng = true
					var sdata = {
						makerUserId: user.userId,
						userTypee: user.type,
						offset: vm.page,
						type:1,
						leagueId:vm.isDaili || ''
					}
					var list = await get('coffeeOrderCountList',sdata)

                    
					if(list.length < 10){
						this.LoadIng = false;
						if(this.page > 0){
							this.more = false
						}
						
					}
					if(init){
						this.dataList = list
						wx.stopPullDownRefresh()
					}else{
						// 滚动加载 ，不能直接覆盖datas 而是累加
       					this.dataList = this.dataList.concat(list)
					}
					wx.hideNavigationBarLoading()
					this.isLoadIng = false
				}
			},

			async getBanner(){
				var vm = this;
				this.bannerList = await get('getPagePic');
			}
	
		},
		//下拉刷新
		onPullDownRefresh () {
		    this.getDataList(true)
		    this.getBanner()
		},
		//滚动加载
		onReachBottom () {
			if(!this.more){
				return
			}
			this.page = this.page+1
			this.getDataList();
		}
		
	}
</script>
<style>
	page{
		background:#fafafa;
	}
	.header{
	  height: 80rpx;
	  width: 100%;
	  line-height: 80rpx;
	  background: #fff;
	  padding-left: 6rpx;
  	  font-size: 26rpx;
	}
	.location{
		 vertical-align: middle;
   		margin-top: -4rpx;
   		width:30rpx;
   		height:30rpx;
	}
	swiper {
		width:100%;
		height:420rpx;
	}

</style>